<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
	<th:block th:include="include :: header('修改文章内容')" />
	<th:block th:include="include :: summernote-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-main-edit" th:object="${main}">
            <input id="mainId" name="mainId" th:field="*{mainId}"  type="hidden">
        	<input type="hidden" name="updateBy" th:value="${@permission.getPrincipalProperty('loginName')}">
        	<h4 class="form-header h4">基本信息</h4>
        	<div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label"><span style="color: red; ">*</span>标题：</label>
                        <div class="col-sm-8">
                            <input id="mainTitle" name="mainTitle" class="form-control" type="text" required  th:field="*{mainTitle}" >
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">副标题：</label>
                        <div class="col-sm-8">
                            <input id="mainSubtitle" name="mainSubtitle" class="form-control" type="text" th:field="*{mainSubtitle}" >
                        </div>
                    </div>
                </div>
            </div>
            
            
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">摘要：</label>
                        <div class="col-sm-8">
                            <input id="mainSummary" name="mainSummary" class="form-control" type="text" th:field="*{mainSummary}" >
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">作者：</label>
                        <div class="col-sm-8">
                            <input id="mainAuthor" name="mainAuthor" class="form-control" type="text" th:field="*{mainAuthor}" >
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">开始时间：</label>
                        <div class="col-sm-8">
                        	<input type="text" class="time-input form-control" id="mainStart" name="mainStart" th:value="${#dates.format(main.mainStart,'yyyy-MM-dd')}" >
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">结束时间：</label>
                        <div class="col-sm-8">
                            <input type="text" class="time-input form-control" id="mainEnd" name="mainEnd" th:value="${#dates.format(main.mainEnd,'yyyy-MM-dd')}" >
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">置顶：</label>
                        <div class="col-sm-8">
                        	<div class="radio-box" th:each="dict : ${@dict.getType('article_istop')}">
								<input type="radio" th:id="${dict.dictCode}" name="istop" th:value="${dict.dictValue}" th:checked="${dict.default}" th:field="*{istop}" >
								<label th:for="${dict.dictCode}" th:text="${dict.dictLabel}"></label>
							</div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">排序：</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="sort" name="sort" th:field="*{sort}" >
                        </div>
                    </div>
                </div>
            </div>
            
             <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">文章分类：</label>
                        <div class="col-sm-8">
                        	<select name="item.itemId" class="form-control m-b" th:field="*{item.itemId}">
	                    		<option th:each="item : ${itemList}" th:text="${item.itemName}" th:value="${item.itemId}"></option>
	                		</select>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label">封面：</label>
                        <div class="col-sm-8">
                            <img id="coverImage" onclick="$('#file').click();" th:src="@{${main.cover}}" style="height:100px;width:200px;" >
                        </div>
                        <input type="file" class="hidden"  accept="image/*" name="file" id="file" onchange="uploadCover()" >
                        <input class="hidden" id="cover" name="cover" />
                    </div>
                </div>
            </div>
            
        
			<h4 class="form-header h4">文章内容</h4>
			
			<div class="row">
				<div class="col-sm-12">
                    <div class="form-group">
                        <div class="col-sm-12">
                        	<input id="content" name="content" type="hidden" th:value="${content.content}" >
				    		<div class="summernote" id="editor" ></div>
                        </div>
                    </div>
                </div>
			</div>
			
			<div class="row">
        		<div class="col-sm-offset-5 col-sm-10">
            		<button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>保 存</button>&nbsp;
            		<button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button>
        		</div>
    		</div>
			
		</form>
	</div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: summernote-js" />
    <script type="text/javascript">
        var prefix = ctx + "article/main";
        
        function uploadCover(){
			var formdata = new FormData(document.getElementById("form-main-edit"));
		    $.ajax({
		        url: prefix + "/uploadCover",
		        data: formdata,
		        type: "post",
		        processData: false,
		        contentType: false,
		        success: function(result) {
		            var path = result.data.path;
		            $("#coverImage").attr("src",ctx + path);
		            $("#cover").val(path);
		        }
		    })
		}
		$(function(){
			 $('.summernote').summernote({
		    	placeholder: '请输入公告内容',
				height : 300,
				lang : 'zh-CN',
				followingToolbar: false,
				callbacks: {
	                onImageUpload: function (files) {
	                    sendFile(files[0], this);
	                }
	            }
			});
			var content = $("#content").val();
		    $('#editor').summernote('code', content);
		});
	   
	    
	    // 上传文件
	    function sendFile(file, obj) {
	        var data = new FormData();
	        data.append("file", file);
	        $.ajax({
	            type: "POST",
	            url: ctx + "common/upload",
	            data: data,
	            cache: false,
	            contentType: false,
	            processData: false,
	            dataType: 'json',
	            success: function(result) {
	                if (result.code == web_status.SUCCESS) {
	                	$(obj).summernote('editor.insertImage', result.url, result.fileName);
					} else {
						$.modal.alertError(result.msg);
					}
	            },
	            error: function(error) {
	                $.modal.alertWarning("图片上传失败。");
	            }
	        });
	    }
		
		$("#form-main-edit").validate({
			onkeyup: false,
			rules:{
				sort:{
					digits:true
				}
			},
			messages: {
		        
		    },
			focusCleanup: true
		});
		
		function submitHandler() {
	        if ($.validate.form()) {
	        	var sHTML = $('.summernote').summernote('code');
				$("#content").val(sHTML);
				$.operate.saveTab(prefix + "/edit", $('#form-main-edit').serialize());
	        }
	    }
	</script>
</body>
</html>
